<!DOCTYPE html>
<html>
<head>
</head>
<body style="height: 100%; margin: 0; overflow: hidden;">
<!--[if IE]><script src="../js/explorercanvas/excanvas.js"></script><![endif]-->
<script src="../js/jsgamesoup.js"></script>
<script>
function startGame(gs) {
		function C() {
			this.x = gs.random(0, gs.width);
			this.y = gs.random(0, gs.height);
			this.vx = gs.random(-3, 3);
			this.vy = gs.random(-3, 3);
			this.r = gs.random(10, 30);
			this.c = gs.random(100, 200);
			this.fs = 'rgba(' + parseInt(this.c) + ', ' + parseInt(this.c) + ', ' + parseInt(this.c) + ', 1.0)';
			
			this.update = function() {
				this.y = (this.y + this.vy + gs.canvas.height) % gs.canvas.height;
				this.x = (this.x + this.vx + gs.canvas.width) % gs.canvas.width;
			}
			
			this.draw = function(c, gs) {
				c.fillStyle = this.fs;
				c.beginPath();
				c.arc(this.x, this.y, this.r, 0, Math.PI*2, true);
				c.closePath();
				c.fill();
			}
		}
		
		for (i=0; i<20; i++)
			gs.addEntity(new C());
}
</script>
<canvas id='surface' jsgs='startGame'></canvas>
</body>
</html>

